import 'package:flutter/material.dart';
import 'package:homepad/iot/air_conditioner.dart';
import 'package:homepad/iot/basic_node.dart';
import 'package:homepad/iot/light_color.dart';
import 'package:homepad/models/nova_model.dart';
import 'package:homepad/screens/panel_air_conditioner.dart';
import 'package:homepad/screens/panel_light_color.dart';
import 'package:homepad/styles.dart';
import 'package:homepad/views/animation_icon.dart';
import 'package:provider/provider.dart';
import 'package:homepad/logger/logger.dart';

enum ItemServiceCardType {
  large,
  medium,
  small,
}

class ItemServiceCard extends StatelessWidget {
  final BasicNode node;
  final ItemServiceCardType cardType;

  const ItemServiceCard({super.key, required this.node, this.cardType = ItemServiceCardType.large});

  void showPanel(BuildContext context, Color barrierColor) {
    Widget panel;
    if (node is LightColor) {
      panel = PanelLightColor(light: node as LightColor, onCancel: () => Navigator.pop(context));
    } else if (node is AirConditioner) {
      panel =
          PanelAirConditioner(air: node as AirConditioner, onCancel: () => Navigator.pop(context));
    } else {
      return;
    }

    showDialog(
        context: context,
        barrierDismissible: true,
        barrierColor: barrierColor,
        builder: (context) => Dialog(
              backgroundColor: Colors.transparent,
              child: panel,
            ));
  }

  @override
  Widget build(BuildContext context) {
    final MyStyles styles = Theme.of(context).extension<MyStyles>()!;
    final height = cardType == ItemServiceCardType.large ? 100.0 : 97.0;

    var basicNode =
        context.select<NovaModel, BasicNode>((nova) => nova.config.getNode(node.endpointId)!);
    final backgroundColor =
        basicNode.state == BasicNodeState.activated ? styles.highlightColor : styles.normalColor;

    final isFan = node.icon == "icon_font_fan";
    final iconColor = isFan ? styles.fanHighlightColor : styles.lightHighlightColor;
    final lightColor =
        basicNode.state == BasicNodeState.activated ? styles.lightNormalColor : iconColor;
    final lightBackgroundColor =
        basicNode.state == BasicNodeState.activated ? iconColor : styles.iconBackgroundColor;
    final textColor = basicNode.state == BasicNodeState.activated ? Colors.black87 : Colors.white;

    var iconAvatar = CircleAvatar(
      maxRadius: (height - 25) / 2,
      backgroundColor: lightBackgroundColor,
      child: Image(
        fit: BoxFit.fill,
        width: height - 25,
        color: lightColor,
        image: AssetImage("assets/images/${node.icon}.png"),
      ),
    );

    return ClipRRect(
      borderRadius: styles.radius,
      child: GestureDetector(
        onTap: () {
          logger.info("${node.name} clicked");
          showPanel(context, styles.dialogBarrierColor);
        },
        child: Container(
          height: height,
          width: 220,
          decoration: BoxDecoration(
            borderRadius: styles.radius,
            border: styles.border,
            color: backgroundColor,
          ),
          child: Stack(
            children: [
              Positioned(
                top: 5,
                bottom: 5,
                left: 13,
                child: GestureDetector(
                  onTap: () {
                    node.toggle();
                  },
                  child: isFan && basicNode.state == BasicNodeState.activated
                      ? AnimationIcon(child: iconAvatar)
                      : iconAvatar,
                ),
              ),
              Positioned(
                  left: 98,
                  top: 20,
                  child: Text(node.name,
                      style: styles.titleStyle.copyWith(letterSpacing: 0.45, color: textColor))),
              Positioned(
                  left: 98,
                  bottom: 20,
                  child: Text(node.desc,
                      style: styles.textStyle.copyWith(fontSize: 20, color: textColor)))
            ],
          ),
        ),
      ),
    );
  }
}
